<script setup lang="ts">
import { ref, onMounted, onUnmounted } from 'vue'
import Header from '../layouts/Header.vue'
import Footer from '../layouts/Footer.vue'
import Nav from '../layouts/Nav.vue'
// import { isMobile } from 'is-mobile'
// const isMobileDevice = ref(isMobile())
</script>

<template>
    <div class="layout">
        <a-layout style="display: flex;flex-direction: column;">
            <a-layout-header style="display: flex;flex-direction: column;">
                <!-- <Header /> -->
                <!-- <Nav /> -->
            </a-layout-header>
            <a-layout-content>
                <router-view />
            </a-layout-content>
            <!-- <a-layout-footer>
                <Footer />
            </a-layout-footer> -->
        </a-layout>
    </div>

</template>

<style scoped>
.layout {
    height: 100%;
    width: 100%;
}

@media (min-width: 1024px) {}
</style>
